import React, { useEffect, useState } from 'react'
import { TreeProps, Tree } from 'antd';
import { getAllCategory } from '../../../apis/category';


type Props = {
    changePid: (id: string) => void,
    pid?: string
}

const ComTreeSelect = ({ changePid, pid }: Props) => {

    const [value, setValue] = useState<string>();
    const [treeData, setTreeData] = useState([]);

    useEffect(() => {
        allCategory()
        setValue(pid)
    }, [pid])

    //获取所有分类数据
    const allCategory = async () => {
        const res = await getAllCategory()
        setTreeData((res as any).data.rows.children)
    }

    const onSelect: TreeProps['onSelect'] = (selectedKeys, info) => {
        console.log('selected', selectedKeys, info);

    };

    const onCheck: TreeProps['onCheck'] = (checkedKeys: any, info) => {
        const pid = checkedKeys[0].toString()
        changePid(pid)
    };


    return (
        <div>
            <Tree
                checkable
                onSelect={onSelect}
                onCheck={onCheck}
                treeData={treeData}
            />
        </div>
    )
}

export default ComTreeSelect